<template>
    <view class="content">
        <!-- 订单确认弹窗 -->
        <uv-popup ref="popup">
            <view class="px-40">
                <view class="fw-800 text-center py-20">订单信息</view>
                <uv-form label-width="100" label-align="right">
                    <uv-form-item label="学员姓名：">
                        <view>{{selectedData.stuName}}</view>
                    </uv-form-item>
                    <uv-form-item label="联系电话：">
                        <view @click="callPhone(selectedData.stuPhoneNum)">{{selectedData.stuPhoneNum}}</view>
                    </uv-form-item>
                    <uv-form-item label="接送地址：">
                        <view>{{selectedData.address}}</view>
                    </uv-form-item>
                    <uv-form-item label="接送时间：">
                        <view>{{selectedData.transferTime}}</view>
                    </uv-form-item>
                    <uv-form-item label="是否有车：">
                        <view>{{selectedData.ownCarFlag=="0"?'无':'有'}}</view>
                    </uv-form-item>
                    <uv-form-item label="练车时长：">
                        <view>{{selectedData.durationHours}}小时</view>
                    </uv-form-item>
                    <uv-form-item label="学员备注：">
                        <view>{{selectedData.remark}}</view>
                    </uv-form-item>
                </uv-form>
                <view class="py-20 pb-30">
                    <uv-button type="primary" @click="receive">确认接单</uv-button>
                </view>
            </view>
        </uv-popup>
        <uv-cell-group>
            <uv-cell :title="list.stuName+'（'+list.stuPhoneNum+'）'"
                :label="'约驾时长：'+list.durationHours+'小时'+' ， 是否有车：'+(list.ownCarFlag==1?'有':'无')" v-for="list in lists">
                <template v-slot:value>
                    <uv-button type="primary" @click="receiving(list)" v-if="list.orderStatus==1">接单</uv-button>
                    <uv-button type="primary" :customStyle="{background:'#ccc',border:'none'}"
                        v-if="list.orderStatus==2">已接单</uv-button>
                </template>
            </uv-cell>
        </uv-cell-group>
        <uv-load-more @loadmore="loadMore" :status="status"></uv-load-more>
        <dragButton @btnClick="toPage" />
    </view>
</template>

<script setup lang="ts">
    import dragButton from "@/components/drag-button/drag-button.vue";
    import { getOrderList, receiveOrder, getPageList } from "@/src/api/index.ts"
    import { onMounted, ref } from 'vue';
    import { onPullDownRefresh } from "@dcloudio/uni-app";
    const lists = ref([]);
    const status = ref('loadmore');
    //页码
    const pageSize = ref(10);
    //刷新
    onPullDownRefresh(() => {
        pageSize.value = 10;
        getPage();
        uni.stopPullDownRefresh();

    })
    onMounted(() => {
        //{orderStatus:}
        getPage();

    })
    const callPhone=(phone)=>{
        uni.makePhoneCall({
            phoneNumber:phone
        })
    }
    const toPage = () => {
        uni.navigateTo({
            url: "/pages/order/coach"
        })
    }
    const getPage = () => {
        getPageList({ pageNo: 1, pageSize: pageSize.value, orderStatus: 1 }).then(res => {
            lists.value = res.result.records;
            //判断分页是否结束
            if (pageSize.value >= res.result.total) {
                status.value = 'nomore'
            }
        })
    }
    //分页查询
    const loadMore = () => {
        pageSize.value += 10;
        // status.value = 'loading '
        getPage();
        console.log('2323')
    }
    const selectedData = ref('');
    const popup = ref(null);
    //订单确认
    const receive = () => {
        receiveOrder({ id: selectedData.value.id }).then(res => {
            if (res.success) {
                uni.showToast({
                    icon: "none",
                    title: "接单成功"
                })
                popup.value.close();
                //更改订单状态
                selectedData.value.orderStatus = 2;
            }

        })
    }
    const receiving = (list) => {
        selectedData.value = list;
        popup.value.open();

    }
</script>

<style>

</style>